<template>
  <j-modal
    switchFullscreen
    :title='title'
    :width='800'
    :visible='visible'
    :maskClosable='false'
    @ok='handleOk'
    @cancel='handleCancel'
    cancelText='关闭'>
    <template slot='footer'>
      <a-button @click='handleCancel'>取消</a-button>
      <a-button type='primary' @click='handleOk' v-if='!disableSubmit'>确认</a-button>
    </template>
    <a-spin :spinning='confirmLoading'>
      <a-form :form='form'>
        <a-row :gutter='24'>
          <!--          所属区域-->
<!--          <a-col :md='8' :sm='24'>-->
<!--            <a-form-item-->
<!--              :labelCol='labelCol'-->
<!--              :wrapperCol='wrapperCol'-->
<!--              label='收货地址编号'-->
<!--              >-->
<!--              <a-input :disabled='disableSubmit' placeholder='请输入'-->
<!--                       v-decorator="['receivingAddressCode',validatorRules.receivingAddressCode ]" />-->
<!--            </a-form-item>-->
<!--          </a-col>-->
          <a-col :md='12' :sm='24'>
            <a-form-item
              :labelCol='labelCol'
              :wrapperCol='wrapperCol'
              label='客户编号'
              >
              <a-input-search v-decorator="['custCode',validatorRules.custCode]"
                              :disabled='disableSubmit'
                              enter-button placeholder='请选择客户' readOnly @search="productSearch2" />
              <a-input v-decorator="[ 'custCode', {}]" readOnly type='hidden' />
<!--              <a-input :disabled='disableSubmit' placeholder='请输入'-->
<!--                       v-decorator="['custCode',validatorRules.custCode]" />-->
            </a-form-item>
          </a-col>
          <a-col :md='12' :sm='24'>
            <a-form-item
              :labelCol='labelCol'
              :wrapperCol='wrapperCol'
              label='客户名称'
              >
              <a-input v-decorator="['custName']" disabled='true' placeholder='' />
            </a-form-item>
          </a-col>
          <!--          行政区域-->
          <a-col :md='12' :sm='24'>
<!--            <a-form-item-->
<!--              :labelCol='labelCol'-->
<!--              :wrapperCol='wrapperCol'-->
<!--              label='收货地区'-->
<!--              >-->
<!--              <a-input :disabled='disableSubmit' placeholder='请输入' v-decorator="['receivedGoodsArea', ]" />-->
<!--            </a-form-item>-->
            <a-form-item
              :labelCol="labelCol"
              :wrapperCol="wrapperCol"
              label="收货地址"
            >
              <j-area-linkage v-model="receivedGoodsArea" :area.sync="form.area" :city.sync="form.city"
                              :disabled="disableSubmit"
                              :province.sync="form.province" type="cascader" @change="handlePca"/>
            </a-form-item>
          </a-col>
          <a-col :md='12' :sm='24'>
            <a-form-item
              :labelCol='labelCol'
              :wrapperCol='wrapperCol'
              label='地址编码'
              >
              <a-input :disabled='disableSubmit' placeholder='请输入' v-decorator="['receivingAddressCode', validatorRules.receivingAddressCode]" />
            </a-form-item>
          </a-col>
          <a-col :md='12' :sm='24'>
            <a-form-item
              :labelCol='labelCol'
              :wrapperCol='wrapperCol'
              label='详细地址'
              >
              <a-input :disabled='disableSubmit' placeholder='请输入' v-decorator="['addressDetailed', validatorRules.addressDetailed]" />
            </a-form-item>
          </a-col>
          <a-col :md='12' :sm='24'>
            <a-form-item
              :labelCol='labelCol'
              :wrapperCol='wrapperCol'
              label='收货人姓名'
              >
              <a-input :disabled='disableSubmit' placeholder='请输入' v-decorator="['receivedGoodsName',validatorRules.receivedGoodsName ]" />
            </a-form-item>
          </a-col>
          <a-col :md='12' :sm='24'>
            <a-form-item
              :labelCol='labelCol'
              :wrapperCol='wrapperCol'
              label='收货人电话'
              >
              <a-input v-decorator="['receivedGoodsTel',validatorRules.receivedGoodsTel ]" :disabled='disableSubmit' oninput="value=value.replace(/[^\d]/g,'')" placeholder='请输入' />
            </a-form-item>
          </a-col>
          <a-col :md='12' :sm='24'>
            <a-form-item
              :labelCol='labelCol'
              :wrapperCol='wrapperCol'
              label='默认地址'
            >
              <a-select
                v-decorator="[ 'ifDefaultStr']"
                :disabled='disableSubmit'
                placeholder='请选择'
              >
                <a-select-option value='1'>
                  是
                </a-select-option>
                <a-select-option value='0'>
                  否
                </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
        </a-row>
      </a-form>
    </a-spin>
<!--    <proChose ref='prochoose2' v-bind='modalProps' @okbro='okbropro2'></proChose>-->
    <store-dealer ref='modalForm' @ok='okbropro2'></store-dealer>
    <proChose ref='prochoose' @okbro='okbropro'></proChose>
  </j-modal>
</template>

<script>
import proChose from '@comp/cn-components/ProChose'
import { getAction, httpAction, postAction } from '@/api/manage'
import { pick } from 'lodash'
import moment from 'moment'
import JTreeSelect from '@/components/cn-form/JTreeSelect'
import JAreaLinkage from '@comp/cn-form/CnAreaLinkage'
import { isMobile, isPermit } from '@/utils/validate'
import UploadImage from '@/components/upload-image/UploadImage'
import JImageUpload from '@/components/cn-form/JImageUpload'
import Area from '@/components/utils/Area'
import StoreDealer from './StoreDealer'

export default {
  name: 'getGoods',
  data() {
    return {
      sendPro: false,
      remarks: '',
      dataSurces: [],
      custData:[],
      // dataSurces3: [],
      manobjList: [0],
      // 财务表头
      financialList: [{}],
      areaData: '',
      receivedGoodsArea: '',
      title: '操作',
      visible: false,
      model: {},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 7 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 }
      },
        //烟草许可证号
        smokeLicenceNum: {
          rules: [
            { required: true, message: '',trigger: 'submit' }
          ]
        },
        //烟草许可证有效日期
        smokeLicenceDate: {
          rules: [
            { required: true, message: '' }
          ]
        },
        //零售许可证
        retailLicenceImg: {
          rules: [
            { required: true, message: '请上传图片', trigger: 'submit' }
          ]
        },
        //陈列照
        disPlayImgList: {
          rules: [
            { required: true, message: [], trigger: 'submit' }
          ]
        },
        businessLicense: {
          rules: [
            { required: true, message: '', trigger: 'submit' }
          ]
        },
        terminalName: {
          rules: [
            { required: true, message: '请输入门店名称' }
          ]
        },
        warehouseName: {
          rules: [
            { required: true, message: '请选择所属仓库' }
          ]
        },
        address: {
          rules: [
            { required: true, message: '请输入详细地址' }
          ]
        },
        dictDataCode: {
          rules: [
            { required: true, message: '请选择渠道类型' }
          ]
        },
      confirmLoading: false,
      form: this.$form.createForm(this),
      validatorRules: {
        // receivingAddressCode: {
        //   rules: [
        //     { required: true, message: '' }
        //   ]
        // },
        custCode:{
          rules: [
            { required: true, message: 'submit' }
          ]
        },
        customerCode: {
          rules: [
            { required: true, message: 'submit' }
          ]
        },
        receivedGoodsName: {
          rules: [
            { required: true, message: 'submit' }
          ]
        },
        receivedGoodsTel: {
          rules: [
            { required: true, message: 'submit' }
          ]
        },
        addressDetailed: {
          rules: [
            { required: true, message: 'submit' }
          ]
        },
        receivingAddressCode: {
          rules: [
            { required: true, message: 'submit' }
          ]
        },
      },
      addOrUpdateUrl: window._CONFIG['domianURL'] + '/receivedgoodsaddress/cnReceivedGoodsAddress/saveOrUpdate'
    }
  },
  components: { JTreeSelect, JAreaLinkage, UploadImage, JImageUpload, proChose,StoreDealer },
  created() {
    this.initAreaData()
    // console.log(this.areaData);
  },
  methods: {
    //收货地址
    handlePca(code) {
      this.model.provinceCode = code[0]
      this.model.cityCode = code[1]
      this.model.areaCode = code[2]
      this.model.province = this.areaData.getText(code).split('/')[0]
      this.model.city = this.areaData.getText(code).split('/')[1]
      this.model.area = this.areaData.getText(code).split('/')[2]
      this.model.receivedGoodsAreaCode = code
    },
    initAreaData() {
      if (!this.areaData) {
        this.areaData = new Area()
      }
    },
    productSearch2() {
      this.$refs.modalForm.showModal()
    },
    add() {
      this.edit()
    },
    edit(record) {
      this.form.resetFields()
      this.model = Object.assign({}, record)
      if(this.model.receivedGoodsAreaCode){
        let code = this.model.receivedGoodsAreaCode
        this.model.provinceCode = code[0]
        this.model.cityCode = code[1]
        this.model.areaCode = code[2]
        this.model.province = this.areaData.getText(code).split('/')[0]
        this.model.city = this.areaData.getText(code).split('/')[1]
        this.model.area = this.areaData.getText(code).split('/')[2]
        let pca = this.model.province + '/' + this.model.city + '/' + this.model.area
        this.receivedGoodsArea = this.areaData.getAreaCodeByText(pca) || ''
      }
      this.model.ifDefault=this.model.ifDefault|| 0
      this.model.ifDefaultStr=this.model.ifDefaultStr|| '否'
      console.log(this.model)
      this.visible = true
      this.$nextTick(() => {
        setTimeout(() => {
          this.form.setFieldsValue(pick(this.model, Object.keys(this.model)))
          //时间格式化
        }, 200)
      })
    },
    // handleCancel() {
    //   this.visible = !this.visible
    // },
    handleCancel(){
      this.close()
    },
    custSearch(status) {
      this.$refs.prochoose.rowKey = 'customerCode'
      let formconfig = [
        {
          key: 'customerCode',
          label: '客户编号'
        },
        {
          key: 'customerName',
          label: '客户名称'
        }
      ]
      let tableconfig = {
        columns: [
          {
            title: '客户编号',
            align: 'center',
            dataIndex: 'customerCode',
            width: 120,
            ellipsis: true
          },
          {
            title: '客户名称',
            align: 'center',
            dataIndex: 'customerName',
            width: 120,
            ellipsis: true
          }
        ],
        list: window._CONFIG['domianURL'] + '/customer/cnCustomer/findPageList',
        multiple: false,
        columW: 8
      }
      let dataSource = []
      if (this.form.getFieldValue('customerCode')) {
        dataSource = [{
          custCode: this.form.getFieldValue('customerName'),
          custName: this.form.getFieldValue('customerCode')
        }]
      }
      this.name = '客户'
      this.$refs.prochoose.edit(formconfig, tableconfig, status, 'status2', dataSource)
    },
    okbropro2(e) {
      console.log(e)
      this.custType = e.custType
      if(e.custType === 1){
        this.form.setFieldsValue({
          custCode: e.dataSource.terminalCode,
          custName: e.dataSource.terminalName,
        })
      }else if(e.custType === 2){
        this.form.setFieldsValue({
          custCode: e.dataSource.custCode,
          custName: e.dataSource.custName,
        })
      }
    },
    close() {
      this.visible = false
      // this.handleCancel()
      this.receivedGoodsArea =''
      this.receivedGoodsAreaCode = ''
    },
    handleOk() {
      let _vm = this
      this.form.validateFields((err, values) => {
        if (!err) {
          this.confirmLoading = true
          if (this.model.id) {
            values.id = this.model.id
          }
          if(values.ifDefaultStr==0||values.ifDefaultStr=='否'){
            values.ifDefault=0
          }else{
            values.ifDefault=1
          }
          values.custType = this.custType
          let formData = Object.assign(this.model, values)
          formData.receivedGoodsArea = this.model.province + this.model.city + this.model.area
          let reg = /^1[3-9]\d{9}$/
          if (!reg.test(formData.receivedGoodsTel)) {
            this.$message.info('请输入正确的手机号')
            this.isDisable = false
            _vm.confirmLoading = false
            return
          }
          if (this.receivedGoodsArea == '') {
            this.$message.info('请选择收货地址')
            this.isDisable = false
            _vm.confirmLoading = false
            return
          }
          postAction(this.addOrUpdateUrl, formData).then(res => {
            if (!res.success) {
              this.$message.error(res.message)
            } else {
              this.$emit('ok')
            }
            _vm.confirmLoading = false
          })
        }
      })
    }
  }
}
</script>

<style lang='less' scoped>
.info-line {
  margin-bottom: 16px;
  display: flex;
  flex-direction: row;
}

.info-line:before {
  content: "";
  flex: 0.1;
  border-bottom: 1px solid #ebedee;
  margin: auto 4px;
}

.info-line:after {
  content: "";
  flex: 0.9;
  border-bottom: 2px solid #ebedee;
  margin: auto 4px;
}

/deep/ .ant-col-sm-3-1 {
  width: 108px;
}

/deep/ .ant-col-sm-21-1 {
  width: 1045px;
}

</style>